<template>
    <div>
        <van-nav-bar :title="title" left-text="返回" right-text="确定" left-arrow @click-left="returnBack"
            @click-right="suumitRobot" />
        <van-field v-model="robotName" label="机器人名" placeholder="请输入机器人名" />
        <van-cell title="聊天背景">
            <!-- 使用 right-icon 插槽来自定义右侧图标 -->
            <template #right-icon>
                <van-uploader v-model="fileList" multiple :max-count="1" :after-read="afterRead"/>
            </template>
        </van-cell>
        
        <image-style
        :robotId = "robotId"
        >
        </image-style>

    </div>
</template>

<script>
import ImageStyle from '@/views/chat/info/components/ImageStyle'
import { uploadBackground, updateRobot} from '@/api/user/robotInfo'
export default {
    // robotId: {
    //         required: false,
    //         type: String
    // },
    name: 'RobotSetting',
    data() {
        return {
            title: '设置机器人',
            robotName: '',
            fileList: [],
            robotId:'125',
            imageUrl:''
        }
    },
    components: {
        ImageStyle
    },
    computed: {},
    methods: {
        onClickRight() {
            console.log('onClickRight send http://localhost')
            const data= {
                robotName: this.robotName,
                file: this.fileList[0],
                robotId: this.robotId
            }
            console.log('data ',data)
        },
        returnBack() {
            this.$router.go(-1)
        },
       async afterRead(file) {
            console.log('uploadImage', file.file)
            var formdata= new FormData()
            formdata.append('robotId', this.robotId)
            formdata.append('file', file.file)
            console.log('data ',formdata)
            this.imageUrl = 'https://robot-background.oss-cn-shenzhen.aliyuncs.com/b2f494ce-6f55-4c13-aa48-a9006f6c4099-backGroundImage-01-14_20_23_27?Expires=1707827007&OSSAccessKeyId=LTAI5tEiUhEpp6iWSUaJBRTh&Signature=4wsgTuEL69xI78yKkKZhYWWZVFY%3D'
            return
            const {data} = await uploadBackground(formdata)
            console.log('uploadImage', data)
        },
        async suumitRobot () {
            // 更新数据
            const data = {
                robotName: this.robotName,
                file: this.fileList[0],
                robotId: this.robotId
            }
            console.log('data ',data)
            const {data:res} = await updateRobot(data)
            if (res.code === 200) {
                this.$toast('修改成功')
                this.$router.go(-1)
                  // 告诉父组件 更新了
                this.$emit('updateRobot')
            }
          
        }
    }
}
</script>

<style scoped lang='scss'></style>
